<template>
  <div style="margin-left:250px ;width: 680px" v-loading="loading">
    <form id="deliveryForm">
      <ul class="reset my_delivery">
        <li v-for="item in this.pageInfo.list" :key="item.positionId &&item.userId">
          <div class="d_item">
            <h2 title="">
              <a target="_blank" href="http://www.lagou.com/jobs/149594.html">
                <em style="font-style: normal;">{{item.position.positionName}}</em>
                <span>（{{item.position.minSalary}}k-{{item.position.maxSalary}}k）</span>
              </a>
            </h2>
            <div class="clear"></div>
            <a title="公司名称" class="d_jobname" target="_blank" href="http://www.lagou.com/c/25927.html">
              {{item.position.companyName}} <span>[{{item.position.city}}]</span>
            </a>
            <span class="d_time">投递时间：{{makeDate(item.applicationTime)}}</span>
            <div class="clear"></div>
            <div class="d_resume">
              使用简历：
              <span>在线简历</span>
            </div>
            <span class="btn_showprogress">
              <span v-if="item.isEmploy==0">未查看</span>
              <span v-if="item.isEmploy==1">通过初筛</span>
              <span v-if="item.isEmploy==2">面试</span>
              <span v-if="item.isEmploy==3">不合适</span>
            </span>
          </div>
        </li>
      </ul>
    </form>
    <div style="float: right">
      <el-pagination
              background
              layout="prev, pager, next"
              :total="pageInfo.total"
              :page-size="pageInfo.pageSize"
              @current-change="handlePage"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import {makeDate, makeSimpleDate} from "../../common/js/dateformat"

  export default {
    name: "applicant-three",
    components: {},
    created() {
      this.user = this.$store.state.user;
      this.getApplicantsByUserId();
    },
    data() {
      return {
        loading: false,
        headIndex: 5,
        pageIndex: 1,
        pageInfo: {},
        user: {},
      }
    },
    methods: {
      getApplicantsByUserId() {
        this.loading = true;
        this.$ajax.post(this.$config.url + `applicants/selApplicantByThree/${this.pageIndex}`, {
          "userId": this.user.userId,
        }).then(res => {
          this.pageInfo = res.data
          this.loading = false;
        })
      },
      makeSimpleDate(date) {
        return makeSimpleDate(date);
      },
      makeDate(date) {
        return makeDate(date)
      },
      handlePage(val) {
        //console.log(val)
        this.pageIndex = val
        //加载数据
        this.selApplicantByFour()
      },
    }
  }
</script>

<style scoped>
  .d_jobname{*width:400px;clear:both;float:left;color:#555;font-size:16px;margin:5px 0;}
  .d_jobname span{color:#999;}
  .d_time{*width:150px;float:right;color:#999999;margin:5px 0;*margin:10px -30px 0 0;}
  .d_resume{clear:both;float:left;color:#999999;margin:5px 0;*width:300px;}
  .d_resume span{color:#333;}
  .btn_showprogress{float:right;color:#019875;font-size:16px;margin:5px 0;position:relative;padding-right:15px;}
  .btn_showprogress i{position: absolute;top: 10px;right: 0px;height:0;width:0;overflow: hidden;font-size: 0;line-height: 0; border-width:6px 6px 0; border-style:solid dashed; border-color:#019875 transparent transparent;-webkit-transition:all 0.4s ease 0s;-moz-transition:all 0.4s ease 0s;-ms-transition:all 0.4s ease 0s;transition:all 0.4s ease 0s;}
  .btn_showprogress i.transform{-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);-webkit-transition:all 0.4s ease 0s;-moz-transition:all 0.4s ease 0s;-ms-transition:all 0.4s ease 0s;transition:all 0.4s ease 0s;}


  .c_delivery {
    margin-bottom: 40px;
    position: relative;
    background-color: #fafafa;
  }

  .c_delivery h1 {
    float: left;
    color: #fff;
    font-size: 24px;
    font-weight: normal;
    height: 43px;
    background: #91cebe;
    margin: -8px 0 10px 48px; /*已投递简历状态:40px;old:20px*/
    padding: 0 20px;
    line-height: 43px;
    position: absolute;
    z-index: 2;
  }

  .c_delivery h1 em {
    background: url(img/title_arrow01.png) no-repeat;
    width: 6px;
    height: 8px;
    position: absolute;
    left: -6px;
    top: 0;
  }

  .c_delivery > dd {
    color: #555;
    padding: 55px 0 20px 0;
    clear: both;
  }
  .delivery_tabs{	background:#e9f2ee;	padding:10px 0;}
  .delivery_tabs ul{background:#fff;margin:0 48px;border-bottom:1px solid #d8d8d8;font-size: 0;}
  .delivery_tabs li{padding:9px 0 5px 0;*padding:9px 0 9px 0;display:inline-block;*display:inline;*zoom:1;}
  .delivery_tabs li a{display:block;*display:inline;padding:3px 21px;font-size:16px;line-height:22px;color:#777;border-right:1px solid #d8d8d8;}
  .delivery_tabs li.last a{width:55px;border-right:none;}
  .delivery_tabs li.current{border-bottom:4px solid #019875;}
  .delivery_tabs li.current a,.delivery_tabs li:hover a{color:#019875;}
  ul.my_delivery{margin:20px ;}
  .my_delivery li{ margin-bottom:30px;background:#fff;position:relative;}
  .my_delivery .d_item{border-left:3px solid #91cebe;overflow:hidden; padding:3px 12px;}
  .my_delivery h2{padding:5px 0; margin:0!important; font-weight:normal;float:left;}
  .my_delivery h2 em{font-size:18px; color:#0d9572; }
  .my_delivery h2 span{color:#e6775c;font-size:16px; float:none;}
  .my_delivery h2 span.expireDay{color:#555;}



</style>